{extend name="public:base" /}
{block name="css"}
<link href="/static/laydate/theme/default/laydate.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.8/css/select2.min.css" rel="stylesheet"/>
{/block}
{block name="content"}
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox ">
                <div class="ibox-content">
                    <div class="row search-form">
                        <div class="col-sm-2 m-b-sm">
                            <select class="form-control" name="user_id" id="supplier-select">
                                <option value="">请选择供应商</option>
                                {volist name="supplier_user_list" id="vo"}
                                <option value="{$vo.user_id}" {:input('user_id') == $vo.user_id ? 'selected' : ''}>{$vo.username} / {$vo.mobile}</option>
                                {/volist}
                            </select>
                        </div>
                        <div class="col-sm-2 m-b-sm">
                            <select class="form-control" name="channel_user_id" id="channel-select">
                                <option value="">请选择渠道商</option>
                                {volist name="channel_user_list" id="vo"}
                                <option value="{$vo.user_id}" {:input('channel_user_id') == $vo.user_id ? 'selected' : ''}>{$vo.username} / {$vo.mobile}</option>
                                {/volist}
                            </select>
                        </div>

                        <div class="col-sm-2 m-b-sm">
                            <div class="input-group">
                                <input placeholder="请输入服务名称" name="service_name" value="{:input('service_name')}" type="text" class="form-control form-control-lg">
                            </div>
                        </div>
                        <div class="col-sm-2 m-b-sm">
                            <div class="input-group">
                                <select name="status" class="form-control form-control-lg">
                                    <option value="0">请选择状态</option>
                                    <option value="1" {:input('status') == 1 ? 'selected' : ''}>申请中</option>
                                    <option value="2" {:input('status') == 2 ? 'selected' : ''}>服务中</option>
                                    <option value="2" {:input('status') == 3 ? 'selected' : ''}>已完成</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-sm-2 m-b-sm">
                            <div class="input-group">
                                <input placeholder="请选择日期" type="text" name="date_range" value="{:input('date_range')}" class="form-control form-control-lg screen-date" readonly>

                                <button type="button" class="btn btn-primary btn-lg screen-btn" style="margin-left: 40px">搜索</button>
                            </div>
                        </div>
                    </div>
                    <div class="table-responsive">
                        <table class="table table-striped">
                            <thead>
                            <tr>
                                <th>ID</th>
                                <th>订单号</th>
                                <th>供应商</th>
                                <th>渠道商</th>
                                <th>服务名称</th>
                                <th>评分</th>
                                <th>状态</th>
                                <th>创建时间</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            {volist name="list" id="vo"}
                            <tr>
                                <td>{$vo.id}</td>
                                <td>{$vo.order_sn}</td>
                                <td>{$vo.supplier_username} / {$vo.supplier_mobile}</td>
                                <td>{$vo.channel_username} / {$vo.channel_mobile}</td>
                                <td>{$vo.service_name}</td>
                                <td>{$vo.score}</td>
                                <td>{$vo.status|doOrderStatus}</td>
                                <td>{:timeFormat($vo.create_time)}</td>
                                <td class="project-actions">
                                    {if $vo.status == 1}
                                    <a class="btn btn-white btn-sm" onclick="setId('{$vo.id}', '派单')" data-toggle="modal" data-target="#paidan">
                                        <i class="iconfont icon-edit"></i> 派单
                                    </a>
                                    <a href="{:url('cancelOrder', ['id' => $vo['id']])}" class="btn btn-white btn-sm ajax-operate">
                                        <i class="iconfont icon-refuse"></i> 取消
                                    </a>
                                    {/if}
                                    {if $vo.status == 2}
                                    <a class="btn btn-white btn-sm" onclick="setId('{$vo.id}', '重新派单')" data-toggle="modal" data-target="#paidan">
                                        <i class="iconfont icon-edit"></i> 重新派单
                                    </a>
                                    <a href="{:url('completeOrder', ['id' => $vo['id']])}" class="btn btn-white btn-sm ajax-operate">
                                        <i class="iconfont icon-success"></i> 已完成
                                    </a>
                                    {/if}
                                </td>
                            </tr>
                            {/volist}
                            </tbody>
                        </table>
                        {if !empty($list)}{$list->render()}{/if}
                    </div>

                </div>
            </div>
        </div>
    </div>

    <div class="modal inmodal" id="paidan" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content animated flipInY">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="modal-title">派单</h4>
                </div>
                <div class="modal-body">
                    <select class="form-control" name="channel_user_id" id="paidan-channel-select">
                        <option value="">请选择渠道商</option>
                        {volist name="channel_user_list" id="vo"}
                        <option value="{$vo.user_id}" {:input('channel_user_id') == $vo.user_id ? 'selected' : ''}>{$vo.username} / {$vo.mobile}</option>
                        {/volist}
                    </select>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-white close-model" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" id="save">确认</button>
                </div>
            </div>
        </div>
    </div>
</div>

{/block}

{block name="js"}
<script src="__STATIC__/jquery/jquery-3.1.1.min.js"></script>
<script src="/static/laydate/laydate.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.8/js/select2.min.js"></script>
<script>
    laydate.render({
        elem: '.screen-date', //指定元素
        format: 'yyyy-MM-dd',
        range: true
    });
    $('#supplier-select').select2()
    $('#channel-select').select2()

    var id = 0;
    function setId(order_id, title) {
        console.log(order_id, title)
        id = order_id;
        $('#paidan .modal-title').html(title);
    }


    $('#save').click(() => {
        var channel_user_id = $('#paidan-channel-select').val();

        $.post('/admin/manage/editChannel', {
            id: id, channel_user_id
        }, res => {
            if (res.result == 1) {
                layer.msg(res.msg, {icon: 1, time: 1000});
                setTimeout(() => {
                    window.location.reload()
                }, 1000)
            } else {
                layer.msg(res.msg, {icon: 2, time: 1000});
            }
        }, 'JSON')
    })
</script>
{/block}

